<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <style>
        #color-input-red +label{
            display: block;
            width: 20px;
            height: 20px;
            cursor: pointer;
            position: absolute;
            top: 2px;
            left: 15px;
            background: rgba(240, 84, 77, 1);;
        }

        /*当input框为选中状态时，lable标签的样式，其中在css选择时，“：”表示当前input框的值，即checked；
              该部分主要对显示的“对号”的大限居中方式，显示颜色进行了设置*/
        #color-input-red:checked +label::before{
            display: block;
            content: "\2714";
            text-align: center;
            font-size: 16px;
            color: white;

    </style>
</head>
<body>
<!--<div class="test1 test2">1</div>-->
<!--<div class="test1 test3">2</div>-->
<input id="color-input-red" class="chat-button-location-radio-input" type="checkbox" name="color-input-red" value="#f0544d" />
<label  for="color-input-red"></label >
<script>
    var arr=[];
   var test=document.getElementsByClassName('test1');
   console.log(test);
    test[1].parentNode.removeChild(test[1]);
    console.log(test);
</script>
</body>
</html>